<template>
    <div class="my-counter">
        <button type="button" class="btn btn-light" @click="jian">-</button>
        <input type="number" class="form-control inp" v-model="goods.goods_count">
        <button type="button" class="btn btn-light" @click="jia">+</button>
    </div>
</template>

<script>
    export default {
        props: {
            goods: {
                type: Object,
                required: true
            }
        },
        methods: {
            jia() {
                this.goods.goods_count++
            },
            jian() {
                this.goods.goods_count--
            }
        }

    }
</script>

<style lang="less" scoped>
    .my-counter {
        display: flex;

        .inp {
            width: 45px;
            text-align: center;
            margin: 0 10px;
        }

        .btn,
        .inp {
            transform: scale(0.9);
        }
    }
</style>